<!doctype html>
<html lang="en-US" class="no-js">
<head>
    <title>PINPOINT</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width">
    <!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
    <link rel="shortcut icon" href="favicon.png" type="image/png">
    <link rel="icon" href="favicon.png" type="image/png">

	<link href='//fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'>
	<link rel="stylesheet" href="lib/css/vendor.css?v=${buildTime}">
	<link rel="stylesheet" href="lib/css/pinpoint.css?v=${buildTime}">
</head>
<body ng-app="pinpointApp">

<!--[if lt IE 9]>
<script src="bower_components/es5-shim/es5-shim.js?v=${buildTime}"></script>
<script src="bower_components/json3/lib/json3.min.js?v=${buildTime}"></script>
<![endif]-->
<div class="modal"  id="customLogPopup">
	<div class="modal-dialog modal-lg" style="width:800px;">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
				<h4>Notice</h4>
			</div>
			<div class="modal-body"></div>
		</div>
	</div>
</div>

<div id="wrapper" ng-class="wrapperClass" ng-style="wrapperStyle" ng-view=""></div>

<!-- ng-template -->
<script id="error" type="text/ng-template">
    <div class="error" style="position:absolute;top:20%;width:90%;margin-left:5%;display:none;z-index:10">
        <div class="alert alert-danger">
            <button type="button" class="close" data-dismiss="alert">&times;</button>
            <h2>Error!</h2>
            <h4 class="msg" style="color:red"></h4>
			<button class="openDetail" onclick="jQuery('#detailErrorResult').toggle()">+</button>
			<div class="detail" style="display:none"  id="detailErrorResult">
				<hr>
				<table style="width:100%">
					<tr>
						<td style="padding-bottom:5px">Method</td>
						<td class="method" style="padding:0px 0px 5px 20px;color:black"></td>
					</tr>
					<tr>
						<td style="padding-bottom:5px">Header</td>
						<td class="header" style="padding:0px 0px 5px 20px;color:black"></td>
					</tr>
					<tr>
						<td style="padding-bottom:5px">Parameters</td>
						<td class="parameters" style="padding:0px 0px 5px 20px;color:black"></td>
					</tr>
					<tr>
						<td style="padding-bottom:5px">URL</td>
						<td class="url" style="padding:0px 0px 5px 20px;color:black"></td>
					</tr>
					<tr>
						<td style="padding-bottom:5px">Stacktrace</td>
						<td style="padding:0px 0px 5px 20px;color:black"><textarea class="stacktrace" disabled style="width:100%;height:340px"></textarea></td>
					</tr>
				</table>
			</div>
        </div>
    </div>
</script>
<script id="warning" type="text/ng-template">
    <div class="warning" style="position:absolute;top:38%;width:90%;margin-left:5%;display:none;z-index:10">
        <div class="alert alert-warning">
            <button type="button" class="close" data-dismiss="alert">&times;</button>
            <h4>Warning!</h4>

            <div class="msg"></div>
        </div>
    </div>
</script>
<script id="info" type="text/ng-template">
    <div class="info" style="position:absolute;top:38%;width:90%;margin-left:5%;display:none;z-index:10">
        <div class="alert alert-info">
            <button type="button" class="close" data-dismiss="alert">&times;</button>
            <h4>Info</h4>

            <div class="msg"></div>
        </div>
    </div>
</script>
<script id="loading" type="text/ng-template">
	<div>
		<div style="position:absolute;top:0px;left:0px;width:100%;height:100%;background-color:#0000FF;opacity:0.1;z-index:9;display:none" class="progress-back">&nbsp;</div>
		<div style="position:absolute;top:10%;width:100%;text-align:center;z-index:10;display:none;" class="progress-tip">
			<img src="/images/tip/tip01_ko.png" style="box-shadow: 7px 7px 10px -1px rgba(0,0,0,0.5);background-color:#FFFFFF;border-radius:20px;">
			<div class="form-group" style="padding-top:10px">
				<label style="background-color:#FFFFFF;padding:5px;font-size:18px;font-weight:bold;border-radius:4px">
					<input type="checkbox" ng-model="loadingOption.hideTip"/> Don't show 30 days
				</label>
			</div>
		</div>
    	<div class="progress progress-striped" style="position:absolute;top:50%;width:90%;margin-left:5%;display:none;z-index:10">
       		<div class="bar progress-bar progress-bar-info" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%"></div>
    	</div>
	</div>
</script>
<script id="sidebarLoading" type="text/ng-template">
    <div class="cg-busy cg-busy-animation ng-hide" ng-show="!!showLoading">
        <div class="cg-busy cg-busy-backdrop"></div>
        <div class="cg-busy-default-wrapper" style="position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px;">
            <div class="cg-busy-default-sign">
                <div class="cg-busy-default-spinner">
                    <div class="bar1"></div>
                    <div class="bar2"></div>
                    <div class="bar3"></div>
                    <div class="bar4"></div>
                    <div class="bar5"></div>
                    <div class="bar6"></div>
                    <div class="bar7"></div>
                    <div class="bar8"></div>
                    <div class="bar9"></div>
                    <div class="bar10"></div>
                    <div class="bar11"></div>
                    <div class="bar12"></div>
                </div>
                <div class="cg-busy-default-text ng-binding">{{loadingMessage}}</div>
            </div>
        </div>
    </div>
</script>

<!-- Modal -->
<div id="supported-browsers" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
     aria-hidden="true">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">Ã</button>
        <h3 id="myModalLabel">Supported Browsers</h3>
    </div>
    <div class="modal-body">
        <div class="main-section--answer main-section content-container"><p>You can access PinPoint via a browser
            installed on a PC, Mac, or Linux computer.</p>

            <h4>To get the latest PinPoint features, use a supported browser</h4>

            <p>In general, PinPoint supports the current and prior major release of Chrome, Firefox, Internet Explorer
                and Safari on a rolling basis. If you use a browser other than those listed below, please install the
                one of them.</p>

            <ul>
                <li>Google Chrome <a href="http://www.google.com/chrome" target="_blank">download</a></li>
                <li>Firefox <a href="http://www.mozilla.org/firefox" target="_blank">download</a></li>
                <li>Internet Explorer <a href="http://windows.microsoft.com/en-US/internet-explorer/download-ie"
                                         target="_blank">download</a></li>
                <li>Safari <a href="http://www.apple.com/safari" target="_blank">download</a></li>
            </ul>

            <h4>To use PinPoint, enable cookies and JavaScript</h4>

            <p>Regardless of your browser type, you must have cookies enabled to use PinPoint. Also, if your browser
                supports it, enable JavaScript.</p>
        </div>
    </div>
    <div class="modal-footer">
        <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
    </div>
</div>

<div class="modal fade" tabindex="-1" role="dialog" ng-controller="ConfigurationCtrl">
	<div class="modal-dialog" role="document" style="width:1000px">
		<div class="modal-content" id="pinpoint-configuration">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close" style="color:#FFF;opacity:1;"><span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Pinpoint Configuration</h4>
			</div>
			<div class="modal-menu">
				<ul>
					<li ng-class="{true: 'active'}[isGeneral()]" ng-click="setCurrentTab('general')">General Configuration</li>
					<li>|</li>
					<li ng-class="{true: 'active'}[isAlarm()]" ng-click="setCurrentTab('alarm')">Alarm Settings</li>
					<li>|</li>
					<li ng-class="{true: 'active'}[isHelp()]" ng-click="setCurrentTab('help')">Help</li>
				</ul>
			</div>
			<div class="modal-body">
				<div id="config-general" ng-show="isGeneral()" ng-controller="GeneralCtrl">
					<div style="text-align:center;font-family:verdana;">
						<div class="general-warning"></div>
						<table class="table table-bordered table-condensed">
							<tbody>
								<tr>
									<td class="col-md-10 title" colspan="4">ServerMap</td>
								</tr>
								<tr>
									<td class="col-md-5">
										<span class="sub-title" style="padding-right:10px">Search Depth</span>
										<span style="padding: 0px 24px 0px 0px">(<img src="images/inbound.png" width="18px" height="18px"/> Inbound <img src="images/outbound.png" width="18px" height="18px"/> Outbount)</span>
										<div class="btn-group btn-group-sm input-group input-group-sm inout-bound" style="margin-top:0px;width:120px;display:inline-block;">
											<button type="button" class="btn btn-default">
												<img src="images/inbound.png" width="18px" height="18px"/> {{callee}} <img src="images/outbound.png" width="18px" height="18px"/> {{caller}}
											</button>
											<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" style="padding-bottom:6px">
												<span class="caret"></span>
												<span class="sr-only">Toggle Dropdown</span>
											</button>
											<div class="dropdown-menu" role="menu">
												<ul class="inbound">
													<li class="inbound-title"><img src="images/inbound.png" width="20px" height="20px"/> Inbound</li>
													<li class="depth" ng-repeat="d in depthList" ng-class="{selected: d === callee}" ng-click="changeCallee(d)">{{d}}</li>
												</ul>
												<ul class="outbound">
													<li class="outbound-title"><img src="images/outbound.png" width="20px" height="20px"/> Outbound</li>
													<li class="depth" ng-repeat="d in depthList" ng-class="{selected: d === caller}" ng-click="changeCaller(d)">{{d}}</li>
												</ul>
												<div style="clear: both;padding: 4px 2px 2px 2px">
													<button type="button" class="btn btn-default btn-xs" style="float:right;" ng-click="closeInOut()">Close</button>
												</div>
											</div>
										</div>
									</td>
									<td class="col-md-5">
										<span class="sub-title">Search Peroid</span>
										<select class="period form-control" ng-change="changePeriod()" ng-model="period" style="width:60%;display:inline-block;height:30px;">
											<option ng-repeat="per in periodTime" ng-selected="per == period" value="{{per}}">{{per}}</option>
										</select>
									</td>
								</tr>
							</tbody>
						</table>
						<table class="table table-bordered table-condensed favorite-application">
							<tbody>
								<tr>
									<td class="col-md-10 title" colspan="4">Favorite Application</td>
								</tr>
								<tr>
									<td class="col-md-5">
										<select class="applicationList" style="width:100%">
											<option ng-repeat="app in applications" value="{{app.text}}">{{app.text}}</option>
										</select>
									</td>
									<td class="col-md-5" colspan="2">
										<div class="favorite-list-wrapper">
											<ul class="favorite-list">
												<li ng-repeat="fav in savedFavoriteList"><img ng-src='/images/icons/{{fav.split("@")[1]}}.png' height="25px"/> {{fav.split('@')[0]}} <button class="btn btn-danger btn-xs" style="float:right" ng-click="removeFavorite(fav)"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></button></li>
											</ul>
											<div ng-show="savedFavoriteList.length == 0" style="color:#F00" class="favorite-empty"></div>
										</div>
									</td>
								</tr>
							</tbody>
						</table>
					</div>
				</div>
				<div id="config-alram" ng-show="isAlarm()">
					<alarm-user-group-directive></alarm-user-group-directive>
					<div style="float:left;padding-left:30px;">
						<div class="btn-group" role="group" style="margin-bottom: 7px;">
							<button type="button" class="btn" ng-class="getMemberButtonStyle()" style="width:110px" ng-click="showMember()">Member</button>
							<button type="button" class="btn" ng-class="getAlarmButtonStyle()" style="width:110px" ng-click="showAlarm()">Alarm</button>
						</div>
						<div id="userListInGroup" ng-show="selectMember">
							<alarm-group-member-directive></alarm-group-member-directive>
							<alarm-pinpoint-user-directive></alarm-pinpoint-user-directive>
						</div>
						<div id="alarmInGroup" ng-hide="selectMember">
							<alarm-rule-directive></alarm-rule-directive>
						</div>
					</div>
				</div>
				<div id="config-help" ng-show="isHelp()" ng-controller="HelpCtrl">
					<div class="left-sub-menu">
						<ul>
							<li><a href="https://github.com/naver/pinpoint/wiki/FAQ" target="_blank" class="link-title">FAQ</a><i class="xi-external-link"></i></li>
							<li><a href="https://github.com/naver/pinpoint/issues" target="_blank" class="link-title">Issues</a><i class="xi-external-link"></i></li>
							<li><a href="https://groups.google.com/forum/#!forum/pinpoint_user" target="_blank" class="link-title">User Group</a><i class="xi-external-link"></i></i></li>
						</ul>
					</div>
					<div class="right-contents">
						<div>Document & Guide</div>
						<table class="table table-bordered table-condensed">
							<tr>
								<td>English</td>
								<td>한국어</td>
							</tr>
							<tr>
								<td>
									<ul>
										<li ng-repeat="helpLink in enHelpList">
											<a href="{{helpLink.link}}" target="_blank"><span class="glyphicon glyphicon-file" aria-hidden="true"></span>{{helpLink.title}}</a>
										</li>
									</ul>
								</td>
								<td>
									<ul>
										<li ng-repeat="helpLink in koHelpList">
											<a href="{{helpLink.link}}" target="_blank"><span class="glyphicon glyphicon-file" aria-hidden="true"></span>{{helpLink.title}}</a>
										</li>
									</ul>
								</td>
							</tr>
						</table>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>


<script src="lib/js/base-lib.min.js?v=${buildTime}"></script>
<script src="lib/js/angular-lib.min.js?v=${buildTime}"></script>
<script src="lib/js/draw-lib.min.js?v=${buildTime}"></script>
<script src="lib/js/util-lib.min.js?v=${buildTime}"></script>
<script src="lib/js/pinpoint-component.min.js?v=${buildTime}"></script>

<script src="scripts/extra/google-analytics.js?v=${buildTime}"></script>
<script src="scripts/app.js?v=${buildTime}"></script>
<!--script src="features/serverList/server-list.directive.js?v=${buildTime}"></script>
<script src="common/help/help-content-en.js?v=${buildTime}"></script>
<script src="common/help/help-content-ko.js?v=${buildTime}"></script>
<script src="lib/js/pinpoint.min.js?v=${buildTime}"></script-->

<script src="common/filters/icon-url.filter.js?v=${buildTime}"></script>
<script src="common/filters/application-name-to-class-name.filter.js?v=${buildTime}"></script>
<script src="common/services/time-slider-vo.service.js?v=${buildTime}"></script>
<script src="common/services/alerts.service.js?v=${buildTime}"></script>
<script src="common/services/progress-bar.service.js?v=${buildTime}"></script>
<script src="common/services/navbar-vo.service.js?v=${buildTime}"></script>
<script src="common/services/url-vo.service.js?v=${buildTime}"></script>
<script src="common/services/transaction-dao.service.js?v=${buildTime}"></script>
<script src="common/services/location.service.js?v=${buildTime}"></script>
<script src="common/services/server-map-dao.service.js?v=${buildTime}"></script>
<script src="common/services/agent-dao.service.js?v=${buildTime}"></script>
<script src="common/services/sidebar-title-vo.service.js?v=${buildTime}"></script>
<script src="common/services/filtered-map-util.service.js?v=${buildTime}"></script>
<script src="common/services/filter.config.js?v=${buildTime}"></script>
<script src="common/services/server-map-filter-vo.service.js?v=${buildTime}"></script>
<script src="common/services/alarm-ajax.service.js?v=${buildTime}"></script>
<script src="common/services/alarm-util.service.js?v=${buildTime}"></script>
<script src="common/services/alarm-broadcast.service.js?v=${buildTime}"></script>
<script src="common/services/server-map-hint-vo.service.js?v=${buildTime}"></script>
<script src="common/services/is-visible.service.js?v=${buildTime}"></script>
<script src="common/services/user-locales.service.js?v=${buildTime}"></script>
<script src="common/help/help-content-en.js?v=${buildTime}"></script>
<script src="common/help/help-content-ko.js?v=${buildTime}"></script>
<script src="common/help/help-content-template.js?v=${buildTime}"></script>
<script src="common/services/help-content.service.js?v=${buildTime}"></script>
<script src="common/services/analytics.service.js?v=${buildTime}"></script>
<script src="common/services/realtime-websocket.service.js?v=${buildTime}"></script>
<script src="common/services/preference.service.js?v=${buildTime}"></script>
<script src="common/services/common-ajax.service.js?v=${buildTime}"></script>
<script src="common/services/agent-ajax.service.js?v=${buildTime}"></script>
<script src="common/services/tooltip.service.js?v=${buildTime}"></script>
<script src="common/services/common-util.service.js?v=${buildTime}"></script>

<script src="features/applicationList/application-list.directive.js?v=${buildTime}"></script>
<script src="features/periodSelector/period-selector.directive.js?v=${buildTime}"></script>
<script src="features/navbar/navbar.directive.js?v=${buildTime}"></script>
<script src="features/navbar2/navbar2.directive.js?v=${buildTime}"></script>
<script src="features/serverMap/server-map.directive.js?v=${buildTime}"></script>
<script src="features/realtimeChart/realtime-chart.directive.js?v=${buildTime}"></script>
<script src="features/scatter/scatter.directive.js?v=${buildTime}"></script>
<script src="features/nodeInfoDetails/node-info-details.directive.js?v=${buildTime}"></script>
<script src="features/linkInfoDetails/link-info-details.directive.js?v=${buildTime}"></script>
<script src="features/serverList/server-list.directive.js?v=${buildTime}"></script>
<script src="features/agentList/agent-list.directive.js?v=${buildTime}"></script>
<script src="features/agentInfo/agent-info.directive.js?v=${buildTime}"></script>
<script src="features/timeSlider/time-slider.directive.js?v=${buildTime}"></script>
<script src="features/transactionTable/transaction-table.directive.js?v=${buildTime}"></script>
<script src="features/timeline/timeline.directive.js?v=${buildTime}"></script>
<script src="features/agentChartGroup/agent-chart-group.directive.js?v=${buildTime}"></script>
<script src="features/sidebar/title/sidebar-title.directive.js?v=${buildTime}"></script>
<script src="features/sidebar/filter/filter-information.directive.js?v=${buildTime}"></script>
<script src="features/distributedCallFlow/distributed-call-flow.directive.js?v=${buildTime}"></script>
<script src="features/responseTimeChart/response-time-chart.directive.js?v=${buildTime}"></script>
<script src="features/loadChart/load-chart.directive.js?v=${buildTime}"></script>
<script src="features/jvmMemoryChart/jvm-memory-chart.directive.js?v=${buildTime}"></script>
<script src="features/cpuLoadChart/cpu-load-chart.directive.js?v=${buildTime}"></script>
<script src="features/tpsChart/tps-chart.directive.js?v=${buildTime}"></script>
<script src="features/loading/loading.directive.js?v=${buildTime}"></script>
<script src="features/configuration/configuration.controller.js?v=${buildTime}"></script>
<script src="features/configuration/help/help.controller.js?v=${buildTime}"></script>
<script src="features/configuration/general/general.controller.js?v=${buildTime}"></script>
<script src="features/configuration/alarm/alarm-user-group.directive.js?v=${buildTime}"></script>
<script src="features/configuration/alarm/alarm-group-member.directive.js?v=${buildTime}"></script>
<script src="features/configuration/alarm/alarm-pinpoint-user.directive.js?v=${buildTime}"></script>
<script src="features/configuration/alarm/alarm-rule.directive.js?v=${buildTime}"></script>
<script src="features/realtimeChart/realtime-chart.controller.js?v=${buildTime}"></script>

<script src="pages/main/main.controller.js?v=${buildTime}"></script>
<script src="pages/inspector/inspector.controller.js?v=${buildTime}"></script>
<script src="pages/transactionList/transaction-list.controller.js?v=${buildTime}"></script>
<script src="pages/transactionDetail/transaction-detail.controller.js?v=${buildTime}"></script>
<script src="pages/filteredMap/filtered-map.controller.js?v=${buildTime}"></script>
<script src="pages/transactionView/transaction-view.controller.js?v=${buildTime}"></script>
<script src="pages/scatterFullScreenMode/scatter-full-screen-mode.controller.js?v=${buildTime}"></script>

<script>
	G_BUILD_TIME = "${buildTime}";
</script>
</body>
</html>
